@charset "utf-8";
/*=============================================================
 sustainability index
=============================================================*/
/* contents */
#contents{margin-top: 0;}

/* contentsInner */
.contentsInner{max-width: 1700px;}
.contentsInner.mw1428{
	max-width: 1428px; 
}
/*=============================================================
 pageTtlMain
=============================================================*/
#pageTtlMain{
	height: 340px;
	padding: 45px 0;
	box-sizing: border-box;
	position: relative;
	margin-bottom: 46px;
}
.no-webp #pageTtlMain{background: #204579 url("/products/img/index_pageTtl.jpg") no-repeat center top;}
.webp #pageTtlMain{background: #204579 url("/products/img/index_pageTtl.webp") no-repeat center top;}

#pageTtlMain .pageTtl{
	text-align: center;
	max-width: 37%;
	width: 100%;
	height: 250px;
	font-size: calc(3rem + (60 - 30) * ((100vw - 768px) / (1700 - 768)));
	font-weight: normal;
	background-color: #FFFFFF;
	padding: 20px;
	box-sizing: border-box;
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
}
	@media screen and (min-width: 1700px) {
	 #pageTtlMain .pageTtl {font-size: 6.0rem;}
	}

#pageTtlMain .pageTtl::after{
	content: '';
	background: url("/products/img/index_pageTtl_square_m.svg") center center no-repeat;
	background-size: 79px 79px;
	width: 79px;
	height: 79px;
	position: absolute;
	bottom: -79px;
	right: -79px;
	z-index: 2;
}
#pageTtlMain .pageTtl::before{
	content: '';
	background: url("/products/img/index_pageTtl_square_s.svg") center center no-repeat;
	background-size: 35.52px 35.52px;
	width: 35.52px;
	height: 35.52px;
	position: absolute;
	top: -35.52px;
	left: -35.52px;
}

/*=============================================================
 products-ac
=============================================================*/
.products-ac{
	display: flex;
	column-gap: 24px;
}
.products-ac>li{width: calc((100% - 24px) / 2);}
.products-ac>li a{
	font-size: calc(1.8rem + (24 - 18) * ((100vw - 768px) / (1700 - 768)));
	line-height: 1.4;
	color: #fff;
	background-color: rgba(0, 100, 182, 1);
	border-radius: 10px;
	padding: 28px 10px 33px;
	box-sizing: border-box;
	position: relative;
	display: flex;
	column-gap: 5%;
	align-items: center;
	justify-content: space-between;
	transition: all .3s;
}
	@media screen and (min-width: 1700px) {
	.products-ac>li a {font-size: 2.4rem;}
	}

.products-ac>li a::after{
	content: '';
	height: 4px;
	background-color: #EF9B9B;
	position: absolute;
	bottom: 20px;
	left: 10px;
	right: 10px;
}
.products-ac>li:last-child a::after{background-color: #B49EFD;}
.products-ac>li a .txt{
	padding: 0 0 0 16px;
	box-sizing: border-box;
}
.products-ac>li a .txt span{
	padding: 0 20px 0 0;
	box-sizing: border-box;
	position: relative;
}
.products-ac>li a .txt span::after {
	content: '';
	background: url(../../shared/img/icon-ac-w.svg) center center no-repeat;
	background-size: 16px 16px;
	width: 16px;
	height: 16px;
	position: absolute;
	bottom: 6px;
	right: 0;
	transition: all .1s;
}
.products-ac>li a:hover{background-color: rgba(0, 100, 182, 0.9);}
.products-ac>li a:hover .txt span::after{bottom: 3px;}

/*=============================================================
 visually-hidden
=============================================================*/
.visually-hidden {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}
/*=============================================================
 products-search-box
=============================================================*/
#products-search-box{padding-top: 20px;}
#products-search-box #products-search{
	max-width: 960px;
	margin: 0 auto;
	display: flex;
	column-gap: 50px;
	align-items: center;
}
#products-search-box #products-search dt{
	max-width: 200px;
	font-size: 2.0rem;
	line-height: 1.4;
	font-weight: bold;
	display: inline-block;
	vertical-align: middle;
}
#products-search-box #products-search dd{width: calc((100% - 250px));position: relative;}
#products-search-box #products-search dd #suggest{width: calc((100% - 60px));}
#products-search-box #products-search dd .formArea{
	position: relative;
	max-width: 100%;
	width: 100%;
	margin: 0 auto;
	height: 60px;
}
#products-search-box #products-search dd .input-form{
	width: 100%;
	border: 1px solid #222;
	border-radius: 5px;
}
#products-search-box #products-search dd .btn{
	position: absolute;
	width: 60px;
	height: 60px;
	background: url(/shared/img/search-btn.png) no-repeat;
	background-size: 60px 60px;
	top: 0;
	right: 0;
	font-weight: 700;
	background-color: transparent;
	border: none;
	cursor: pointer;
	outline: none;
	padding: 0;
	appearance: none;
}

/*=============================================================
 products-tabs
=============================================================*/
#products-tabs{margin-top: 74px;}
#products-tabs .inner{
	max-width: 1300px;
	margin: 0 auto;
}
#products-tabs.products-tab-set{}
#products-tabs.products-tab-set .products-tab-btn{
	display: flex;
	column-gap: 20px;
  padding: 0 var(--bothSides);
}
#products-tabs.products-tab-set .products-tab-btn>*{
	width: calc((100% - 60px) / 4);
	text-align: center;
}
#products-tabs.products-tab-set .products-tab-btn>* a{
	display: block;
	font-size: calc(1.4rem + (18 - 14) * ((100vw - 768px) / (1700 - 768)));
	color: #222;
	background-color: #EDF3F5;
	border-radius: 10px 10px 0 0;
	padding: 20px 10px 18px;
	box-sizing: border-box;
	height: 100%;
	transition: all .3s;
}
	@media screen and (min-width: 1700px) {
	#products-tabs.products-tab-set .products-tab-btn>* a {font-size: 1.8rem;}
	}
#products-tabs.products-tab-set .products-tab-btn>* a:hover,
#products-tabs.products-tab-set .products-tab-btn>* a.act{
	background-color: #D3E0E5;
	position: relative;
}
#products-tabs.products-tab-set .products-tab-btn>* a:hover::after,
#products-tabs.products-tab-set .products-tab-btn>* a.act::after{
	content: '';
	height: 3px;
	background-color: #0064B6;
	position: absolute;
	bottom: 0;
	left:15px;
	right: 15px;
	 
}
/* tab-panel* */
.products-tab-set>.tab-panel>*{display:none;}
.products-tab-set>.tab-panel>.act{display:block;}
.tab-panel > div {
	margin-top: -96px;
	padding-top: 96px;
}
.products-tab-set>.tab-panel .itemArea{
	background-color: #D3E0E5;
	margin-top: -1px;
	padding: 50px var(--bothSides);
}
.products-tab-set>.tab-panel .itemArea .item{position: relative;}
.products-tab-set>.tab-panel .itemArea .item .item-img{
	display: flex;
	column-gap: 20px;
	justify-content: space-between;
	border-bottom: 1px solid #ADB4B9;
}
.products-tab-set>.tab-panel .itemArea .item .item-img>*:nth-child(-n+2){flex: 2;}
.products-tab-set>.tab-panel .itemArea .item .item-img>*:last-child{flex: 1;}
.products-tab-set>.tab-panel .itemArea .item .item-img dt{
	padding-top: 40px;
	position: relative;
}
.products-tab-set>.tab-panel .itemArea .item .item-img dt .item-ttl{
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	margin-top: 0!important;
}
.products-tab-set>.tab-panel .itemArea .item .item-img dt .photo{
	display: flex;
	width: 100%;
	flex-wrap: nowrap;
}
.products-tab-set>.tab-panel .itemArea .item .item-img dt .photo img{max-width: 100%;width: 100%;}
.products-tab-set>.tab-panel .itemArea .item .item-img .form-checkbox{border-bottom: none;}
.products-tab-set>.tab-panel .itemArea .item .item-ttl{
	font-size: 1.6rem;
	line-height: 1.2;
	font-weight: 700;
}
.products-tab-set>.tab-panel .itemArea .item dl:nth-child(n + 2) .item-ttl{margin-top: 16px;}
.products-tab-set>.tab-panel .form-checkbox{
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	column-gap: 10px;
	border-bottom: 1px solid #ADB4B9;
	padding-bottom: 30px;
	box-sizing:border-box;
}
.products-tab-set>.tab-panel .form-checkbox>*{
	max-width: calc((100% - 30px) / 4);
	width: 100%;
	padding-top: 14px;
	box-sizing: border-box;
	display: flex;
	column-gap: 10px;
	align-items: flex-start;
	justify-content: flex-start;
}
.products-tab-set>.tab-panel .form-checkbox.check1>*{
	max-width: 100%;
	width: 100%;
}
.products-tab-set>.tab-panel .form-checkbox.check2>*{
	max-width: calc((100% - 20px) / 2);
	width: 100%;
}
.products-tab-set>.tab-panel .form-checkbox.check6>*{
	max-width: calc((100% - 50px) / 6);
	width: 100%;
}
.products-tab-set>.tab-panel .form-checkbox label{
	position: relative;
	padding: 0;
	cursor: pointer;
	width: calc((100% - 25px));
}
.products-tab-set>.tab-panel .form-checkbox input[type="checkbox"]{
	display: inline-block;
	width: 25px;
	height: 25px;
}
.form-checkbox input[type="checkbox"]:checked + label::after,
.products-tab-set>.tab-panel .form-checkbox label::before{content: none;}

/*.products-tab-set>.tab-panel .form-checkbox label::before {
	content: "";
	position: absolute;
	left: 0;
	top: 16px;
	width: 25px;
	height: 25px;
	border-radius: 5px;
	border: 1px solid #ADB4B9;
	background-color: #fff;
	margin-top: inherit;
	transform: translateY(-50%);
}*/
/*.products-tab-set>.tab-panel .form-checkbox input[type="checkbox"]:checked + label::before{background:#03a9f4;}
.products-tab-set>.tab-panel .form-checkbox input[type="checkbox"]:checked + label::after{
	content:"\2713";
	color:#fff!important;
	font-size:1.5rem;
	font-weight:bold;
	line-height:18px;
	text-align:center;
	width:18px;
	height:18px;
	margin-top:-10px;
	position:absolute;
	top:50%;
	left:0;
}*/
.products-tab-set>.tab-panel .btnAll{
	justify-content: flex-start;
	padding-top: 25px;
}

.products-tab-set>.tab-panel .itemArea .btnSubmit{
	text-align: center;
	margin-top: 25px;
	padding-top: 12px;
}
.products-tab-set>.tab-panel .itemArea .btnSubmit .btn {
	text-align: left;
	border: 1px solid #0064B6;
	color: #222;
	width: 224px;
	font-weight: 700;
	line-height: 1.6;
	padding: 20px 56px 20px 20px;
	box-sizing: border-box;
	transition: all .3s;
	border-radius: 40px;
	background: #fff url(/shared/img/icon-arw-button.svg) center right 20px no-repeat;
}
.products-tab-set>.tab-panel .itemArea .btnSubmit .btn:hover{
	background: var(--bgColorLightBlue) url(/shared/img/icon-arw-button.svg) center right 15px no-repeat;
}
/*=============================================================
 resultsArea
=============================================================*/
.resultsArea{padding: 0 0 50px;}
[id^="products-results0"]>.contentsInner{margin-top: 50px!important;}
.resultsArea .txtUsage{
	font-size: 2.4rem;
	font-weight: 500;
	text-align: center;
	line-height: 1.6;
}
/* resultsBox */
.resultsBox{
	background-color: #EFF5F7;
	padding: 50px 0;
}
.resultsBox .resultsSet{
	border-bottom: 1px solid #ADB4B9;
}
.resultsBox .resultsBox-ttl{
	display: flex;
	align-items: flex-end;
	line-height: 1.2;
	justify-content: space-between;
	margin-bottom: 30px;
}
.resultsBox .resultsBox-ttl .txtResults{font-weight: 700;}
.resultsBox .resultsBox-ttl .txtResults .num{font-size: 5.0rem;}
.resultsBox .resultsBox-ttl .toggle-btnAll{
	cursor: pointer;
	position: relative;
	border: none;
	background-color: transparent;
	color: var(--linkColor);
	font-weight: 700;
}
.resultsBox .resultsBox-ttl .toggle-btnAll:before,
.resultsBox .resultsBox-ttl .toggle-btnAll:after{
	content: "";
	background-color: var(--linkColor);
	display: block;
	width: 17px;
	height: 2px;
	margin-top: 0px;
	position: absolute;
	top: 50%;
	right: 20px;
	transition: all 0.3s ease;
}
.resultsBox .resultsBox-ttl .toggle-btnAll::after{transform:rotate(90deg);}
.resultsArea.open .resultsBox .resultsBox-ttl .toggle-btnAll::after{transform:rotate(0);}
.resultsBox .resultsBox-ttl .toggle-btnAll .circle{
	box-sizing: border-box;
	display: table-cell;
	vertical-align: middle;
	height: 59px;
	padding: 10px 60px 10px 14px;
	position: relative;	
}
.resultsBox .resultsBox-ttl .toggle-btnAll .circle::after{
	content: "";
	display: block;
	border: 2px solid var(--linkColor);
	border-radius: 100%;
	width: 32px;
	height: 32px;
	position: absolute;
	right: 11px;
	top: 50%;
	margin-top: -16px;
}
.resultsArea .resultsBox .resultsBox-ttl .toggle-btnAll .close, .resultsArea.open .resultsBox .resultsBox-ttl .toggle-btnAll .open{display: none;}
.resultsArea.open .resultsBox .resultsBox-ttl .toggle-btnAll .close{display: block;}

.resultsArea dl.inner dt{
	font-size: 3.2rem;
	font-weight: 700;
	line-height: 1.2;
	padding: 20px 0 30px;
	position: relative;
}
.resultsArea dl.inner dt::after{
	content: '';
	height: 4px;
	width: 100%;
	position: absolute;
	background: linear-gradient(90deg, #1acbff 0%, #0064b6 100%);
	top: 0;
	left: 0;
	right: 0;
}
.resultsArea dl.inner dd{padding-bottom: 80px;}
.resultsArea dl.inner dd .link-arw{
	display: flex;
	flex-wrap: wrap;
	column-gap: 20px;
}
.resultsArea dl.inner dd .link-arw>*{width: calc((100% - 20px) / 2);}

.resultsSet .box-toggle::after{
	height: 1px;
	background: #ADB4B9;
}
.resultsSet .box-toggle .toggle-btn>span{padding: 40px 60px 40px 30px;}
.resultsSet .box-toggle.open>.toggle-box{padding: 0 60px 30px 60px;}
.resultsSet .box-toggle + .box-toggle{margin-top: 0;}
.resultsSet .box-toggle.toggle-set.open .toggle-btn,.resultsSet .box-toggle.toggle-set.open .toggle-box{background-color: #fff;}
.resultsSet .box-toggle>.toggle-box .clm{
	display: flex;
	column-gap: 20px;
}
.resultsSet .box-toggle>.toggle-box .clm .photo,
.resultsSet .box-toggle>.toggle-box .clm .btn{width: 220px;}
.resultsSet .box-toggle>.toggle-box .clm .photo img{
    width: 100%;
    max-height: 165px;
    object-fit: contain;
}
.resultsSet .box-toggle>.toggle-box .clm .text{width: calc((100% - 240px));}
.resultsSet .box-toggle>.toggle-box .clm.contactBox{
    padding: 20px 30px;
    margin-top: 30px;
    background: #f3f3f3;
}
.resultsSet .box-toggle>.toggle-box .clm.contactBox .ttl{
	color: var(--keyColor);
	font-size: 1.8rem;
	font-weight: 700;
}
.resultsSet .box-toggle>.toggle-box .clm.contactBox p + p{margin-top: 10px!important;}
.resultsSet .box-toggle>.toggle-box .clm .btn .link-btn-normal a{
	font-size: 1.6rem;
	width: 100%;
	padding: 14px 56px 14px 20px;
}

/*=============================================================
 products-block
=============================================================*/
/*.products-block:before {
	content: "";
	display: block;
	height: 100px;
	margin-top: -100px;
	visibility: hidden;
}*/
.products-block .contentsInner{}
.products-block .contentsInner .products-col{
	background-color: #0064B6;
	display: flex;
	color: #fff;
	justify-content: space-between;
}
.products-block .contentsInner .products-col>*{width: 50%;}
.products-block .contentsInner .products-col .textBox{
	padding: 40px;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	justify-content: center;	
}
.products-block .contentsInner .products-col .textBox .ttl{
	font-size: calc(3.2rem + (38 - 32) * ((100vw - 768px) / (1700 - 768)));
	line-height: 1.2;
	position: relative;
	padding-bottom: 20px;
	margin-bottom: 20px;
}
.products-block .contentsInner .products-col .textBox .ttl::after{
	content: '';
	height: 4px;
	background-color: #EF9B9B;
	position: absolute;
	bottom: 0;
	/*left: calc(50% - 50vw);*/
	left: 0;
	right: -40px;
}
#ac02.products-block .contentsInner .products-col .textBox .ttl::after{
	background-color: #B49EFD;
}
	@media screen and (min-width: 1700px) {
	.products-block .contentsInner .products-col .textBox .ttl{font-size: 3.8rem;}
	}
.products-block .contentsInner .products-col .textBox .text{
	font-size: 2.0rem;
	line-height: 1.6;
}
.products-block .contentsInner .products-col .textBox .flx{
	display: flex;
	flex-wrap: wrap;
	column-gap: 5%;
	margin-top: 1.0em!important;
	max-width: 700px;
}
.products-block .contentsInner .products-col .textBox .flx>*{
	width: calc((95% - 20px) / 2);
	margin-top: 1.0em!important;
}
.products-block .contentsInner .products-col .textBox .link-btn-normal a{
	display: flex;
	justify-content: center;
	width: 100%;
	background-color: #fff;
	padding: 12px 56px 12px 20px;
}
.products-block .contentsInner .products-col .imgBox{
	/*flex: 1;
	margin-right: calc(50% - 50vw);*/
}
.products-block .contentsInner .products-col .imgBox img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/*=============================================================
 related-business
=============================================================*/
.related-business{
	padding-top: 70px;
	padding-bottom: 140px;
}
.related-business .ttl{
	font-size: 2.4rem;
	position: relative;
	padding-top: 20px;
	padding-bottom: 36px;
}
.related-business .ttl::after{
	content: '';
	height: 4px;
	width: 100%;
	position: absolute;
	background: linear-gradient(90deg, #1acbff 0%, #0064b6 100%);
	top:0;
	left: 0;
	right: 0;
}
.related-business .list{
	display: flex;
	flex-wrap: wrap;
	column-gap: 24px;
}
.related-business .list>*{width: calc((100% - 24px) / 2);}
.related-business .list>*:nth-child(n+3){margin-top:20px;}
.related-business .list>* a{
	display: flex;
	align-items: center;
	column-gap: 24px;
	border: 1px solid var(--linkColor);
	border-radius: 10px;
	overflow: hidden;
	background-color: #EFF5F7;
	height: 98%;
}
.related-business .list>* a .imgBox{
	overflow: hidden;
	max-width: 160px;
}
.related-business .list>* a .imgBox .imgInner{
	transition: all .3s ease;
	height: 100%;
}
.related-business .list>* a .imgBox .imgInner img{
	height: 150px;
	object-fit: cover;
}
.related-business .list>* a:hover .imgBox .imgInner{transform: scale(1.2);}
.related-business .list>* a .textBox{
	padding: 5px 50px 5px 0;
	box-sizing: border-box;
	width: calc((100% - 160px));
	position: relative;
}
.related-business .list>* a .textBox::after{
	content: '';
	background: url("/eng/shared/img/icon-arw-button.svg") center center no-repeat;
	background-size: 24px 24px;
	width: 24px;
	height: 24px;
	position: absolute;
	top: calc(50% - 12px);
	right: 20px;
	transition: all .1s;
}
.related-business .list>* a:hover .textBox::after{right: 17px;}
.related-business .list>* a .textBox .ttllink{
	font-size: 1.8rem;
	line-height: 1.3;
	color: #222;
	margin-bottom: 5px;
}
.related-business .list>* a .textBox p{
	color: #222;
	line-height: 1.3;
}

/*+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 Tablet (portrait)
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
@media only screen and (min-width:768px) and (max-width:1023px){
/*=============================================================
 products-block
=============================================================*/
.products-block{background-color: #0064B6;}	
.products-block .contentsInner{padding: 30px 4.8%;}	
.products-block .contentsInner .products-col{display: block;background-color: transparent;}
.products-block .contentsInner .products-col>*{width: 100%;}
.products-block .contentsInner .products-col .textBox{display: block;}
.products-block .contentsInner .products-col .textBox .ttl{font-size: 3.2rem;}
.products-block .contentsInner .products-col .textBox .text{font-size: 1.6rem;}
	
.products-block .contentsInner .products-col .textBox .flx{
	display: flex;
	flex-wrap: wrap;
	column-gap: 5%;
	margin-top: 1.0em!important;
	max-width: 700px;
}
.products-block .contentsInner .products-col .textBox .flx>*{
	width: calc((95% - 20px) / 2);
	margin-top: 1.0em!important;
}
.products-block .contentsInner .products-col .imgBox{
}
.products-block .contentsInner .products-col .imgBox img{
	height: auto;
	object-fit:inherit;
}
	
/*=============================================================
 related-business
=============================================================*/
.related-business{
	padding-top: 36px;
	padding-bottom: 70px;
}
.related-business .ttl{
	font-size: 2.4rem;
	padding-top: 16px;
	padding-bottom: 20px;
}
.related-business .list{display: block;}
.related-business .list>*{width: 100%;}
.related-business .list>*:nth-child(n+2){margin-top:20px;}
.related-business .list>* a{column-gap: 16px;}
.related-business .list>* a .imgBox{max-width: 25%;}
.related-business .list>* a .imgBox img{object-fit: cover;}	
.related-business .list>* a .textBox{
	padding: 10px 50px 10px 0;
	width: calc((100% - 25%));
}
.related-business .list>* a .textBox::after{top: calc(50% - 12px);}
.related-business .list>* a .textBox .ttllink{font-size: 1.8rem;}	
	
}


/*+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 Smartphones
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
@media only screen and (max-width:767px){
/*=============================================================
 pageTtlMain
=============================================================*/
#pageTtlMain{
	height: 255px;
	padding: 65px 0;
	box-sizing: border-box;
	position: relative;
	margin-bottom: 26px;
}
.no-webp #pageTtlMain{background: url("/products/img/index_pageTtl.jpg") no-repeat center top;background-size: auto 255px;}
.webp #pageTtlMain{background: url("/products/img/index_pageTtl.webp") no-repeat center top;background-size: auto 255px;}		
#pageTtlMain .pageTtl{
	max-width: 75%;
	height: 120px;
	font-size: 2.8rem;
	padding: 16px 10px;
	letter-spacing: 0;
}
#pageTtlMain .pageTtl::after{
	background-size: 40px 40px;
	width: 40px;
	height: 40px;
	bottom: -40px;
	right: -40px;
}
#pageTtlMain .pageTtl::before{
	content: '';
	background: url("/ir/img/index_pageTtl_square_s.svg") center center no-repeat;
	background-size: 17.76px 17.76px;
	width: 17.76px;
	height: 17.76px;
	position: absolute;
	top: -17.76px;
	left: -17.76px;
}
	
/*=============================================================
 products-ac
=============================================================*/
.products-ac{display: block;}
.products-ac>li{width: 100%;}
.products-ac>li + li{margin-top: 20px;}	
.products-ac>li a{font-size: 1.8rem;}
.products-ac>li a>*{width: calc((100% - 5%)/2);}	
.products-ac>li a .txt span::after {bottom: 6px;}
	
/*=============================================================
 products-search-box
=============================================================*/
#products-search-box #products-search{display: block;}
#products-search-box #products-search dt{
	max-width: 100%;
	display: block;
	text-align: center;
	margin-bottom: 20px;
}
#products-search-box #products-search dd{width:100%;}
	
/*=============================================================
 products-tabs
=============================================================*/
#products-tabs{margin-top: 50px;}
#products-tabs .inner{
	max-width: inherit;
	margin: 0!important;
}
	
#products-tabs.products-tab-set .products-tab-btn{
    column-gap: 4px;
    padding: 0 1.8%;
    justify-content: space-between;
    letter-spacing: normal;
}
#products-tabs.products-tab-set .products-tab-btn>*{width: calc((100% - 18px) / 4);}
#products-tabs.products-tab-set .products-tab-btn>* a{
    font-size: 12px;
    font-weight: 700;
    line-height: 1.4;
    padding: 20px 2px 18px;
}
#products-tabs.products-tab-set .products-tab-btn>* a:hover::after,
#products-tabs.products-tab-set .products-tab-btn>* a.act::after{right: 0;}
	
/* tab-panel* */
.products-tab-set>.tab-panel .itemArea{padding: 30px 4.8%;}
.products-tab-set>.tab-panel .itemArea .item{position: relative;}
.products-tab-set>.tab-panel .itemArea .item .item-img{
	display: block;
	border-bottom: none;
}
.products-tab-set>.tab-panel .itemArea .item .item-img>*{
	display: flex;
	column-gap: 10px;
	flex-direction: row-reverse;
}
.products-tab-set>.tab-panel .itemArea .item dl:nth-child(n + 2){margin-top: 20px;}	
.products-tab-set>.tab-panel .itemArea .item .item-img dl{
	position: relative;
	border-bottom: 1px solid #ADB4B9;
}
.products-tab-set>.tab-panel .itemArea .item .item-img dl:last-child{padding-bottom: 20px;}	
.products-tab-set>.tab-panel .itemArea .item .item-img dt{
	width: 30%;
	padding-top: 40px;
	position: static;
}
.products-tab-set>.tab-panel .itemArea .item .item-img dd{
	width: calc((70% - 10px));
	padding-top: 30px;
}	
.products-tab-set>.tab-panel .itemArea .item .item-img dt .item-ttl{display: block;}
.products-tab-set>.tab-panel .itemArea .item .item-img dt .photo{display: block;}
.products-tab-set>.tab-panel .itemArea .item .item-img dt .photo>*{}
.products-tab-set>.tab-panel .itemArea .item .item-img .form-checkbox{border-bottom: none;}
.products-tab-set>.tab-panel .itemArea .item .item-ttl{font-size: 1.7rem;}
.products-tab-set>.tab-panel .itemArea .item dl:nth-child(n + 2) .item-ttl{margin-top: 0;}
.products-tab-set>.tab-panel .form-checkbox:not(.check6):not(.btnAll){display: block;padding-bottom: 25px;}
.products-tab-set>.tab-panel .form-checkbox:not(.btnAll)>*{max-width:inherit;}	
.products-tab-set>.tab-panel .form-checkbox.check1>*,
.products-tab-set>.tab-panel .form-checkbox.check2>*{max-width: 100%;}
.products-tab-set>.tab-panel .form-checkbox.check6>*{max-width: calc((100% - 10px) / 2);}	
.products-tab-set>.tab-panel .btnAll{
	display: flex;
	padding-top: 25px;
}
/*=============================================================
 resultsArea
=============================================================*/
.resultsArea{padding: 40px 0;}
.resultsArea .txtUsage{font-size: 2.2rem;}
	 
/* resultsBox */
.resultsBox{padding: 40px 0;}
.resultsBox .resultsSet{}
.resultsBox .resultsBox-ttl{}
.resultsBox .resultsBox-ttl .txtResults .num{font-size: 4.2rem;}
.resultsBox .resultsBox-ttl .toggle-btnAll .circle span{font-size: 1.5rem;}
.resultsSet .box-toggle .toggle-btn>span{padding: 36px 80px 36px 20px;}
.resultsSet .box-toggle.open>.toggle-box{padding: 0 20px 30px 20px;}
.resultsSet .box-toggle>.toggle-box .clm{display: block;}
.resultsSet .box-toggle>.toggle-box .clm>* + *{margin-top: 20px;}	
.resultsSet .box-toggle>.toggle-box .clm .photo,
.resultsSet .box-toggle>.toggle-box .clm .btn{width: 100%;}
.resultsSet .box-toggle>.toggle-box .clm .text{width: 100%;}
.resultsSet .box-toggle>.toggle-box .clm.contactBox{padding: 15px;}
.resultsSet .box-toggle>.toggle-box .clm .btn .link-btn-normal a{width: 100%;}
.resultsArea dl.inner dt{
	font-size: 2.4rem;
	padding: 20px 0 30px;
}
.resultsArea dl.inner dd{padding-bottom: 60px;}
.resultsArea dl.inner dd .link-arw{display: block;}
.resultsArea dl.inner dd .link-arw>*{width: 100%;}
	
/*=============================================================
 products-block
=============================================================*/
.products-block{background-color: #0064B6;}	
.products-block .contentsInner{padding: 30px 4.8%;}	
.products-block .contentsInner .products-col{display: block;background-color: transparent;}
.products-block .contentsInner .products-col>*{width: 100%;box-sizing: border-box;}
.products-block .contentsInner .products-col .textBox{display: block;padding: 20px;}
.products-block .contentsInner .products-col .textBox .ttl{font-size: 3.1rem;}
.products-block .contentsInner .products-col .textBox .ttl::after{right: 0;}	
.products-block .contentsInner .products-col .textBox .text{font-size: 1.6rem;}
	
.products-block .contentsInner .products-col .textBox .flx{
	display: block;
	max-width: inherit;
}
.products-block .contentsInner .products-col .textBox .flx>*{width: 100%;}
.products-block .contentsInner .products-col .imgBox img{
	height: auto;
	object-fit:inherit;
}	
/*=============================================================
 related-business
=============================================================*/
.related-business{
	padding-top: 36px;
	padding-bottom: 70px;
}
.related-business .ttl{
	font-size: 2.4rem;
	padding-top: 16px;
	padding-bottom: 20px;
}
.related-business .list{display: block;}
.related-business .list>*{width: 100%;}
.related-business .list>*:nth-child(n+2){margin-top:20px;}
.related-business .list>* a{column-gap: 16px;}
.related-business .list>* a .imgBox{max-width: 25%;}
.related-business .list>* a .imgBox img{object-fit: cover;}
.related-business .list>* a .imgBox .imgInner img{min-height: 205px;}		
.related-business .list>* a .textBox{
	padding: 10px 50px 10px 0;
	width: calc((100% - 25%));
}
.related-business .list>* a .textBox::after{top: calc(50% - 12px);}
.related-business .list>* a .textBox .ttllink{font-size: 1.8rem;}

}